<template>
	<div>
		<van-tabs v-model="activeName" line-width="64px">
			<van-tab title="全部回答" :name="0">
				<div class="line10px">
				</div>
				<div class="pl16 pr16" v-for="(item, index) in data" :key="index" @click="$router.push({ name: 'AskReplyDetail', params: { role: 'farmer', id: item.problemId } })">
					<div class="pt16 pb12 lh23 border-bottom-1">
						<div class="flex">
							<div><span class="blue white fz12 pd2">问</span></div>
							<div class="pl12 fz16">{{ item.title }}</div>
						</div>
						<div class="flex pt11 lh23 pb8">
							<div><span class="bgred white fz12 pd2">答</span></div>
							<div class="pl12 fz16">{{ item.lastRelpy }}</div>
						</div>
						<div class="tr" style="color: #999;" v-if="item.count > 0">全部{{ item.count }}个答案</div>
					</div>
				</div>
			</van-tab>
			<van-tab title="我的提问" :name="1">
				<div class="line10px">
				</div>
				<div class="pl16 pr16" v-for="(item, index) in data" :key="index" @click="$router.push({ name: 'AskReplyDetail', params: { role: 'farmer', id: item.problemId } })">
					<div class="pt16 pb12 lh23 border-bottom-1">
						<div class="flex">
							<div><span class="blue white fz12 pd2">问</span></div>
							<div class="pl12 fz16">{{ item.title }}</div>
						</div>
						<div class="flex pt11 lh23 pb8">
							<div><span class="bgred white fz12 pd2">答</span></div>
							<div class="pl12 fz16">{{ item.lastRelpy }}</div>
						</div>
						<div class="tr" v-if="item.count > 0">全部{{ item.count }}个答案</div>
					</div>
				</div>
			</van-tab>
		</van-tabs>
	</div>
</template>
<script>
import { Tab, Tabs } from 'vant'
import API from '@/services'
export default {
	data() {
		return {
			activeName: 0,
			data: [],
			name: '',
		}
	},
	watch: {
		activeName: {
			async handler() {
				this.getList()
			},
			immediate: true,
		},
		'$store.getters.inputValue'(name) {
			this.name = name
			this.getList()
		},
	},
	methods: {
		async getList() {
			const data = await API.getCourseProblemList({ params: { flag: this.activeName, keyword: this.name } })
			this.data = data
		},
	},
	components: {
		VanTabs: Tabs,
		VanTab: Tab,
	},
}
</script>
<style lang="scss" scoped>
.router-container{
	padding: 0!important;
}
</style>
